<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
	String path = request.getContextPath();
	String basePath = request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!-- 定义项目路径   url标签可以  -->
<c:set var="baseCtx" value="${pageContext.request.serverName}:${pageContext.request.serverPort}${pageContext.request.contextPath}"/>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<!--  -->
	<jsp:include page="inc.jsp"></jsp:include>
	<link href="${ctx}/jslib/Uimaker/css/style.css" rel="stylesheet" type="text/css" />
	<link rel="stylesheet" href="${ctx}/jslib/layui/css/layui.css" media="all">
	<link rel="stylesheet" href="${ctx}/css/common.css" />
	<link href="${ctx}/css/index.css" rel="stylesheet" type="text/css" />
	<script src="../js/main.js" type="text/javascript" charset="utf-8"></script>
	<link rel="stylesheet" href="${ctx}/css/main.css" />
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>伊翔分销平台系统</title>
	<script type="text/javascript">

		var index_layout;
		var index_tabs;
		var index_tabsMenu;
		var layout_west_tree;
		var layout_west_tree_url = '';

		var sessionInfo_userId = '${sessionInfo.id}';
		if (sessionInfo_userId) {//如果没有登录,直接跳转到登录页面
			layout_west_tree_url = '${ctx}/resource/tree';
		}else{
			window.location.href='${ctx}/admin/index';
		}

		function logout(){
			//修改
			layer.confirm('您确定要退出吗？', {
				btn: ['确定','取消'], //按钮
				title:'安全退出'
			}, function(){
				$.post( '${ctx}/admin/logout', function(result) {
					if(result.success){
						progressClose();
						window.location.href='${ctx}/admin/index';
					}
				}, 'json');
			}, function(index){
				layer.close(index);
			})
		}


		function editUserPwd() {
			parent.$.modalDialog({
				title : '修改密码',
				width : 300,
				height : 250,
				href : '${ctx}/user/editPwdPage',
				buttons : [ {
					text : '修改',
					handler : function() {
						var f = parent.$.modalDialog.handler.find('#editUserPwdForm');
						f.submit();
					}
				} ]
			});
		}
		function editUserInfo(){

		}
		function refresh(){
			var index = index_tabs.tabs('getTabIndex', index_tabs.tabs('getSelected'));
			var tab = index_tabs.tabs('getTab', index);
			if (tab.panel('options').closable) {
				index_tabs.tabs('close', index);
			}
		};
		//消息提醒
		function getInformation(){
			$.ajax({
				type:"post",
				url:"${ctx}/msg/message",
				success:function(data){
					console.log(data);
					for(var i=0;i<data.obj.length;i++){
						var prefix=data.obj[i];
						console.log(prefix)
						var url="/msg/messageView?createUser="+prefix.createUser+
								"&endTime="+prefix.endTime+"&startTime="+prefix.startTime+
								"&tradeType="+prefix.tradeType+"&status="+prefix.status+"&type="+prefix.type;
						if(prefix.type == 1){
							$("#rechargeCheck").html(data.obj[i].count);
							/* $("#arechargeCheck").attr("href",url); */
							$("#arechargeCheck").click(function(){
								alert("充值记录！")
								jump("充值记录",url);
							});

						}else if(prefix.type == 2){
							$("#withdrawCheck").html(data.obj[i].count);
							$("#awithdrawCheck").click(function(){
								jump("提现记录",url);
							});
						}else if(prefix.type == 3){
							$("#ticketPay").html(data.obj[i].count);
							$("#aticketPay").click(function(){
								jump("待支付",url);
							});
						}else if(prefix.type == 4){
							$("#withdrawPay").html(data.obj[i].count);
							$("#awithdrawPay").click(function(){
								jump("切位订单",url);
							});
						}else if(prefix.type == 5){
							$("#contractCheck").html(data.obj[i].count);
							$("#acontractCheck").click(function(){
								jump("切位订单",url);
							});
						}else if(prefix.type == 6){
							$("#contractEnd").html(data.obj[i].count);
							$("#acontractEnd").click(function(){
								jump("切位订单",url);
							});
						}else if(prefix.type == 7){
							$("#contractCancel").html(data.obj[i].count);
							$("#acontractCancel").click(function(){
								jump("切位订单",url);
							});
						}else if(prefix.type == 8){
							$("#ticketSuccess").html(data.obj[i].count);
							$("#aticketSuccess").click(function(){
								jump("出票完成",url);
							});
						};

					};
				},
				error:function(msg){
					layer.alert("请检查您的网络连接，然后重试！");
				}
			});
		};
		//页面跳转
		function jump(title,url){
			window.parent.addTab({title : title,url : url});
		};
	</script>


</head>

<body>
<ul class="information">
	<li id="arechargeCheck"><span>充值审核结果(<span id="rechargeCheck"></span>)</span></li>
	<li id="awithdrawCheck"><span>提现审核结果(<span id="withdrawCheck"></span>)</span></li>
	<li id="aticketPay"><span>票款付款结果(<span id="ticketPay"></span>)</span></li>
	<li id="awithdrawPay"><span>押金付款结果(<span id="withdrawPay"></span>)</span></li>
	<li id="acontractCheck"><span>合同审核结果(<span id="contractCheck"></span>)</span></li>
	<li id="acontractEnd"><span>合同终止(<span id="contractEnd"></span>)</span></li>
	<li id="acontractCancel"><span>合同取消(<span id="contractCancel"></span>)</span></li>
	<li id="aticketSuccess" class="borBotNo"><span>出票完成提醒(<span id="ticketSuccess"></span>)</span></li>
</ul>
<div class="userNameBox">
	<ul class="userName">
		<li class="left userName1">欢迎,<span id="userName">${sessionInfo.name}</span></li>
		<li class="left newsRemind" id="newsRemind">消息</li>
		<li class="right exit" onclick="editUserPwd()">修改密码</li>
		<li class="right exit" onclick="logout()">退出<img src="../image/exit.gif"></li>
		<li class="right aboutUs">关于我们</li>
	</ul>
</div>
<!-- 一级导航 -->
<div class="navBox">
	<ul class="nav">
		<li class="logo"><img src="../image/logo.gif"></li>
		<li class="nav1">财务管理<img class="triangle" src="../image/triangle.gif"></li>
		<li class="nav1">产品采购<img class="triangle" src="../image/triangle.gif"></li>
		<li class="nav1">平台供应商<img class="triangle" src="../image/triangle.gif"></li>
		<li class="nav1">订单管理<img class="triangle" src="../image/triangle.gif"></li>
		<li class="nav1">报表中心<img class="triangle" src="../image/triangle.gif"></li>
		<li class="nav1">账户管理<img class="triangle" src="../image/triangle.gif"></li>
		<li class="nav1">商家管理<img class="triangle" src="../image/triangle.gif"></li>
		<li class="nav1">系统管理<img class="triangle" src="../image/triangle.gif"></li>
		<li class="nav1">产品采购<img class="triangle" src="../image/triangle.gif"></li>
	</ul>
</div>
<!-- 二级导航 -->
<div class="navSecBox">
	<ul class="navSec" >
		<li><a href="###">订单查询</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
	<ul class="navSec">
		<li><a href="###">财务管理</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
	<ul class="navSec">
		<li><a href="###">系统管理</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
	<ul class="navSec">
		<li><a href="###">设置备注</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a class="visited" href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
	<ul class="navSec">
		<li><a href="###">资源管理</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
	<ul class="navSec">
		<li><a href="###">财务查询</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
	<ul class="navSec">
		<li><a href="###">数据字典</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
	<ul class="navSec">
		<li><a href="###">日志管理</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
	<ul class="navSec">
		<li><a href="###">角色管理</a></li>
		<li><a href="###">订单管理</a></li>
		<li><a href="###">日志管理</a></li>
		<li><a href="###">客户管理</a></li>
		<li><a href="###">航司管理</a></li>
		<li><a href="###">角色管理</a></li>
		<li><a href="###">用户管理</a></li>
		<li><a href="###">供应商/采购商管理</a></li>
		<li class="noBackground"><a href="###">数据字典</a></li>
	</ul>
</div>
<!-- 内容区 -->
<div class="reserve">
	<div class="reserveBox">
		<ul class="reserveHeader">
			<li class="redText">航班查询<img src="${ctx}/image/planeSmall.gif"></li>
			<li class="hover active">散客预定</li>
			<li class="hover">切位预定</li>
		</ul>
		<ul class="list" id="reserveSK">
			<li style="line-height: 20px">
				<input type="radio" style="width:15px;" name="routingType" id="routeType1" value="ROUND" checked="checked"><label for="routeType1">往返程</label>
				<input type="radio" style="width:15px;" name="routingType" id="routeType2" value="TO"><label for="routeType2">单程</label>
			</li>
			<li >出发城市：
				<input type="text" value="" size="15" id="homecity_name" name="homecity_name" style="width:150px;height: 23px" mod="address|notice" mod_address_source="hotel" mod_address_suggest="" mod_address_reference="startCity" mod_notice_tip="中文/拼音" />
				<img class="city" src="${ctx}/image/city.gif">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
				<input id="startCity" name="startCity" type="hidden" value="" />
				到达城市：
				<input type="text" value="" size="15" id="getcity_name" name="getcity_name" style="width:150px;height: 23px" mod="address|notice" mod_address_source="hotel"  mod_address_reference="arrCity" mod_notice_tip="中文/拼音" />
				<img class="city" src="${ctx}/image/city.gif">
				<input id="arrCity" name="arrCity" type="hidden" value="" />
			</li>
			<li>

			</li>
			<li class="dateList">
				去程日期：
				<input type="text" id="startDate" class="textbox" value="${requestScope.deptDate}" onFocus="new WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'%y-%M-\#{%d+2}',maxDate:'#F{$dp.$D(\'endDate\')}'})" style="width: 155px;height: 20px"/>
				<img class="city" src="${ctx}/image/date.gif">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
				至<input type="text" id="endDate" class="textbox" value="${requestScope.endDate}" onFocus="new WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startDate\')}'})" style="width: 155px;height: 20px"/>
				<img class="city" src="${ctx}/image/date.gif">
			</li>
			<li>
				舱位等级：
				<select data-options="panelHeight:'auto'" id="seat"style="height:23px">
					<option value="">请选择</option>
					<option value="E">经济舱</option>
					<option value="F">头等舱</option>
					<option value="C">商务舱</option>
					<option value="S">bootTable</option>
				</select>
			</li>
			<li><img class="dateImg" src="${ctx}/image/search.gif"><span class="query" id="query">查询</span></li>
		</ul>
		<ul class="list" id="reserveQW" style="display:none;">
			<li>出发城市：
				<input type="text" value="" size="15" id="homecity_name1" name="homecity_name1" style="width:150px;height: 23px" mod="address|notice" mod_address_source="hotel" mod_address_suggest="" mod_address_reference="startCity1" mod_notice_tip="中文/拼音" />
				<img class="city" src="${ctx}/image/city.gif">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
				<input id="startCity1" name="startCity1" type="hidden" value="" />
				到达城市：
				<input type="text" value="" size="15" id="getcity_name1" name="getcity_name1" style="width:150px;height: 23px" mod="address|notice" mod_address_source="hotel"  mod_address_reference="arrCity1" mod_notice_tip="中文/拼音" />
				<img class="city" src="${ctx}/image/city.gif">&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
				<input id="arrCity1" name="arrCity1" type="hidden" value="" />
			</li>
			<li>
				舱位等级：
				<select id="seat1" style="height:23px">
					<option value="">请选择</option>
					<option value="E">经济舱</option>
					<option value="F">头等舱</option>
					<option value="C">商务舱</option>
					<option value="S">bootTable</option>
				</select>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
				座位数：
				<input type="text" id="seatCount"  style="width:150px;height: 23px"/>
			</li>
			<li>
				<img class="dateImg searchImg" src="${ctx}/image/search.gif">
				<input type="button" value="查询" class="query" id="queryQw"/>
			</li>
		</ul>
		<img class="planeBig" src="${ctx}/image/planeBig.gif">
	</div>
</div>
<div class="newsBox">
	<div class="news">
		<ul class="newsHeader">
			<li>热点公告<img src="${ctx}/image/news.gif"></li>
			<li class="right">查看更多</li>
		</ul>
		<ul class="newsContent">
			<li>
				<div class="left newsContent1"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
				<div class="left newsContent1 newsContent2"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
			</li>
			<li>
				<div class="left newsContent1"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
				<div class="left newsContent1 newsContent2"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
			</li>
			<li>
				<div class="left newsContent1"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
				<div class="left newsContent1 newsContent2"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
			</li>
			<li>
				<div class="left newsContent1"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
				<div class="left newsContent1 newsContent2"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
			</li>
			<li>
				<div class="left newsContent1"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
				<div class="left newsContent1 newsContent2"><span class="left">航信10月20日-10月25日之间系统维护通知</span><span class="right">2016-07-03</span></div>
			</li>
		</ul>
	</div>
</div>
<!-- 底部 -->
<div class="footerBox">
	<div class="footer">

	</div>
</div>
<script src="${ctx}/jslib/layui/layui.js"></script>
<script type="text/javascript" src="${ctx }/jslib/airport/fixdiv.js"></script>
<script type="text/javascript" src="${ctx }/jslib/airport/address.js"></script>
<script>
	var userId=${sessionInfo.id};
	var socket = null;  // 判断当前浏览器是否支持WebSocket
	if (window.WebSocket){
		socket = new WebSocket("ws://${baseCtx}/chat/"+userId);
	} else {
		console.log("该浏览器不支持本系统部分功能，请使用谷歌或火狐浏览器！");
		layer.alert('该浏览器不支持本系统部分功能，请使用谷歌或火狐浏览器！');
	}
	layui.use('layim', function(layim){
		var autoReplay = [
			'您好，我现在有事不在，一会儿再和您联系。'
		];
		//基础配置
		layim.config({
			//获取主面板列表信息
			init: {
				url: '${ctx}/user/imList' //接口地址（返回的数据格式见下文）
				,type: 'get' //默认get，一般可不填
				,data: {} //额外参数
			}
			//配置我的信息（如果设定了该参数，则优先读取该参数，如果没有，这读取init返回的mine信息）
			,mine: {
				"username": "${sessionInfo.name}" //我的昵称
				,"id": "${sessionInfo.id}" //我的ID
				,"status": "online" //在线状态 online：在线、hide：隐身
				,"sign": "沒辦法，就是這麼牛！" //我的签名
				,"avatar": "${ctx}/image/logo.jpg" //我的头像
			}
			,uploadImage: {
				url: '${ctx}/file/imUploadFile?userId='+userId
				,type: '' //默认post
			}
			,uploadFile: {
				url: '${ctx}/file/imUploadFile?userId='+userId
				,type: '' //默认post
			}
			,brief: false //是否简约模式（默认false，如果只用到在线客服，且不想显示主面板，可以设置 true）
			,title: '咿咿' //主面板最小化后显示的名称
			,min: false //用于设定主面板是否在页面打开时，始终最小化展现。默认false，即记录上次展开状态。
			,minRight: null //【默认不开启】用户控制聊天面板最小化时、及新消息提示层的相对right的px坐标，如：minRight: '200px'
			,maxLength: 3000 //最长发送的字符长度，默认3000
			,isfriend: true //是否开启好友（默认true，即开启）
			,isgroup: false //是否开启群组（默认true，即开启）
			,right: '2px' //默认0px，用于设定主面板右偏移量。该参数可避免遮盖你页面右下角已经的bar。
			,chatLog: '' //聊天记录地址（如果未填则不显示）
			,find: '' //查找好友/群的地址（如果未填则不显示）
			,copyright: true //是否授权，如果通过官网捐赠获得LayIM，此处可填true
		});
		// 连接发生错误的回调方法
		socket.onerror = function() {
			console.log("连接失败!");
		};
		// 连接成功建立的回调方法
		socket.onopen = function(event) {
			console.log("链接成功!");
		}

		// 接收到消息的回调方法
		socket.onmessage = function(event) {
			console.log("收到消息啦:" +event.data);
			var obj=eval("("+event.data+")");
			layim.getMessage(obj);
		}

		// 连接关闭的回调方法
		socket.onclose = function() {
			console.log("关闭连接！!");
		}
		// 监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
		window.onbeforeunload = function() {
			socket.close();
		}

		// 监听发送消息
		layim.on('sendMessage', function(data){
			var obj={
				"mine":{
					"avatar":data.mine.avatar,
					"content":data.mine.content,
					"id":data.mine.id,
					"mine":true,
					"username":data.mine.username
				},
				"to":{
					"avatar":data.to.avatar,
					"id":data.to.id,
					"name":data.to.groupname,
					"sign":data.to.sign,
					"type":data.to.type,
					"username":data.to.username
				}
			}
			console.log(data);
			socket.send(JSON.stringify(obj));  	//发送消息倒Socket服务
		});
		//监听在线状态的切换事件
		layim.on('online', function(data){
			console.log(data);
		});

		//layim建立就绪
		layim.on('ready',function(res){

		});

		//监听查看群员
		layim.on('members', function(data){
			//console.log(data);
		});

		//监听聊天窗口的切换
		layim.on('chatChange', function(data){
			//console.log(data);
		});

	});
</script>
</body>
</html>